Gmaper - Google Maps for Elementor

WordPress plugins Documentation

Gmaper is a WordPress plugin to add extended Google maps without using iframes or code knowledge. It provides an easy and fast process for creating unlimited markers, legends, map styles, and customizing other settings. The map widget can enhance any type of site, be it a blog of travelers visiting places around the world, a business company with multiple locations, or a real estate agency showing key features of the area.

The plugin includes many useful features to cover most of your needs when creating your own location block. You can create the required number of markers by specifying the longitude and latitude, use a custom image as a marker, add title and description, customize its display styles according to the requirements. With the legends, the Gmaper provides more information, explanation for your visitors about the location, or map interpretation. Manage various map display options via simple toggles like Map type, Street view, Zoom controls, Show legend, Overlay and many others. Moreover, you can specify the type of map and select one of the available display styles or use a custom one using JSON code.

Color schemes fo G Maps
Color schemes fo G Maps
Full flexibility of Google Maps
Full flexibility of Google Maps
Includes Templates for Elementor
Includes Templates for Elementor
Crafted for Elementor Builder
Crafted for Elementor Builder
Suitable for all kind of Layouts and Templates
Suitable for all kind of Layouts and Templates
Completely Cross-Browser Support
Completely Cross-Browser Support
Perfect for Popular Elementor Themes
Perfect for Popular Elementor Themes

We made sure that it was easy for you to get started with the Gmaper plugin. With the plugin, you get 5 unique stylized and go-to-use templates.  These are just some examples that can inspire you to create your style. It provides you a quick start in a few clicks.

The plugin has straightforward and flexible style settings. You can set the base map configuration, overlay, typography, colors, background, border, and other things for different elements. It is possible to apply various styles for different item states like normal or hover.

Gmaper for Elementor is exceptionally compatible with all modern browsers. It does not matter which browser users view your site: Chrome, Firefox, Opera, Safari, or Edge. Everything will look great on all devices and in all browsers.

Features of the Gmaper plugin for Elementor

The plugin installation takes only a few seconds. Also, you do not need to make any additional settings. The plugin is ready to work immediately after installation – you only need to install and activate it in WordPress. Read more about capabilities and settings in the Online Documentation.

Installing the WordPress plugin is quick and straightforward. After you have downloaded the archive with the plugin, you will see the file with the plugin inside. Unzipped purchased the product you will see inside the archive with the plugin pluginname.zip There are two ways to install it:

Installation of the Plugin through the WordPress Admin panel ( Recommended for most users )

STEP 1

First of all, open WordPress admin area login page and login in into WordPress as Admin. To do this visit http://yoursitename/wp-admin

STEP 2

Go to Plugins > Add New

Add New Plugin to WordPress
Add New Plugin to WordPress
STEP 3

Click Upload Plugin Button

Upload New Plugin to WordPress
Upload New Plugin to WordPress
STEP 5

Choose archive with Plugin and press Install Now Button

STEP 6

After Installing go back to the Plugins page and click Activate below plugin title

Activate Installed Plugin

Installation the plugin through FTP or build-in File manager

STEP 1

Use Login and Password to connect to your web-server via FTP or use your hosting file manager.

STEP 2

Upload archive with plugin to /wp-content/plugins

STEP 3

On next step Unzip the archive with the plugin

STEP 4

Installing WordPress Plugin is almost finished. Go to the Plugins page and click Activate below plugin title. You can find out your username and password on the website of your hosting provider.

Activate Installed Plugin

After installing and activating the plugin, you can go to settings of the Plugin. Also, you can read more helpful articles about WordPress Themes and WordPress Plugins.

Add a Google map without using iframes or code knowledge. It provides an easy and fast process for creating unlimited markers, legends, map styles, and customizing other settings. The map widget can enhance any type of site, be it a blog of travelers visiting places around the world, a business company with multiple locations, or a real estate agency showing key features of the area.

For further work, you need the Elementor to be installed on your site. You can download it from wordpress.org

Once you install and activate the plugin, go to Elementor>Gmaper for Elementor>Google Maps API Key and enter your own API key. How to get the key read in the documentation.

Open or create a page using Elementor and drag the widget to a page using the Element editor to start customizing. In the left pane of the editors, you can customize the widget to the style of your site. Each of the tabs presented a specific group of settings:

Content Tab

The Content section has all the basic Google map settings like coordinates, markers, legends, display options, etc.

Center location

Specify the coordinates of the central location on the map. Read how to get your place coordinates.

LATITUDE

Specify the latitude of the center map location.

LONGITUDE

Specify the longitude of the center map location.

USER LOCATION

The option allows you to auto-detect the user location and display it as a central location.

Latitude and longitude of central map location

Map settings

A map example with almost all map settings enabled

Legend

A section for adding the required number of legends for the map box.

To add a new legend, click “Add Item” and fill or edit all the fields.

Legend settings of the Gmaper

Marker

A section for adding the required number of markers for the map box.

To add a new marker, click “Add Item” and fill or edit all the fields.

Marker settings of the Gmaper

Map styles

Select one of the available map styles or use the JSON code for your custom style.

STANDARD
Standard map style
SILVER
Silver map style
RETRO
Retro map style
DARK
Dark map style
NIGHT
Night map style
AUBERGINE
Aubergine map style
CUSTOM

Enter your Json code to change the map style.

Style tab

On the style tab, you can manage the Google Map, marker, and legend styles like colors, size, typography, borders, padding/margin, etc.

Map

NORMAL/HOVER

The map style settings for different states.

Overlay

Marker title/Marker description/Legend title

NORMAL/HOVER

The text style settings for different states.

Legend

NORMAL/HOVER

The legend style settings for different states.

Legend items

NORMAL/HOVER

The item style settings for different states.